<!-- <div class="span4" ms-if="!noCategory">
    <div class="search-options-picker">
        <div ms-repeat="categories" class="search-nav-pills">
            <p>{{el.title}}</p>
            <ul class="nav nav-pills" id="grade-list">
                <li ms-repeat-c="el.collections" ms-class-active="c==el.current">
                    <a ms-click="changeCategory(c)" title="{{ c.title }}">{{ c.title }}</a>
                </li>
            </ul>
        </div>
    </div>
</div> -->
<div ms-class-span8="!noCategory">
    <div class="of-h po-r">
        <!-- <ul class="nav nav-tabs tabs" ms-if="!noCategory">
            <li ms-repeat="orders" ms-class-active="el==currentOrder">
                <a ms-click="changeOrders($event,el,this)">{{el.title}}</a>
            </li>
        </ul> -->
        <div class="toggle-grid-btn-group list-grid-toggle-wraper">
            <a ms-repeat="toggleBtns" class="ico" ms-class-on="el.style==currentStyle" ms-click-on="changeStyle(el)" ms-class="{{el.style}}">{{el.title}}</a>
        </div>
        <li ms-if="!collections.length">
            <div class="alert mt_10">{{$lang.noResult}}</div>
        </li>
        <div ms-visible="toggleStyle" class="videolist body single-line-videolist p-t5 ">
            <ul>
                <li ms-repeat-el="collections" class="onlineList">
                    <div class="video-photo" style="">
                        <a ms-attr-href="el.href" >
                            <img class="online-img" ms-attr-src="$images.DefaultImg" ms-attr-title="el.name" ms-data-original2="$sitePath+el.coverOnlineUri" ms-data-original="$sitePath+el.coverUri" />
                        </a>
                        <i class="ico live-onlive-icon" ms-if="el.isLive"></i>
                        <i class="ico live-disable-icon" ms-if="!el.isLive"></i>
                    </div>
                    <div class="video-infos">
                        <p >
                            <i class="ico nav-dark-icon"></i><span >{{el.name}}</span>
                        </p>
                        <p >
                            <span ms-if="el.liveTitle">
                                <i class="ico title-dark-icon"></i><span >{{el.liveTitle}}</span>
                            </span>
                            <span >&nbsp;</span>
                            
                        </p>
                        <p >
                            <span ms-if="el.liveStartTimeTip">
                                <i class="ico clock-dark-icon"></i><span >{{el.liveStartTimeTip}}</span>
                            </span>
                            <span ms-if="el.liveSpeaker">
                                <i class="ico speaker-dark-icon"></i> <span >{{el.liveSpeaker}}</span>
                            </span>
                            <span ></span>
                        </p>
                        <div>
                            <a ms-attr-href="el.href" ms-attr-title="el.title" class="to-playbtn " ms-class-living="el.isLive">
                                {{$lang.joinin}}
                            </a>
                        </div>
                    </div>
                </li>
                <li class="left_fix">&nbsp;</li>
                <li class="left_fix">&nbsp;</li>
                <li class="left_fix">&nbsp;</li>
            </ul>
        </div>
        <div ms-visible="!toggleStyle" class="videolist-table ">
            <ul>
                <li ms-repeat-el="collections" class="onlineList">
                    <div class="video-photo-td">
                        <div class="video-photo">
                            <a ms-attr-href="el.href" >
                                <img class="online-img" ms-attr-src="$images.DefaultImg" ms-attr-title="el.name" ms-data-original2="$sitePath+el.coverOnlineUri" ms-data-original="$sitePath+el.coverUri" />
                            </a>

                            <i class="ico live-onlive-icon" ms-if="el.isLive"></i>
                            <i class="ico live-disable-icon" ms-if="!el.isLive"></i>
                            </a>
                           
                        </div>
                    </div>
                    <div class="video-infos-td">
                        <div class="video-infos">
                            <div class="title" style="font-weight:normal">
                                <a ms-attr-href="el.href" ms-attr-title="el.title">
                              {{el.title}} 
                            </a>
                            </div>
                            <div class="video-time"> 
                               
                                <p class="video-address" ms-if="el.name">
                                    <i class="ico nav-dark-icon"></i>{{el.name}}
                                </p>
                                <p class="video-address" ms-if="el.liveTitle">
                                    <i class="ico title-dark-icon"></i>{{el.liveTitle}}
                                </p>
                                <p class="video-time" ms-if="el.liveStartTimeTip">
                                    <i class="ico clock-dark-icon"></i> {{el.liveStartTimeTip}}
                                </p>
                                <p class="video-time" ms-if="el.liveSpeaker">
                                    <i class="ico speaker-dark-icon"></i> {{el.liveSpeaker}}
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="video-other-td ">
                        <a ms-attr-href="el.href" ms-attr-title="el.title" class="to-playbtn" ms-class-living="el.isLive">
                            {{$lang.joinin}}
                        </a>
                    </div>
                </li>
            </ul>
        </div>
        <div class="" style="text-align: center;">
            <div ms-widget="pager, livetablewidgetpager,pager" ms-if="pager.pageCount != 1"></div>
        </div>
    </div>
